import React from "react";
import { Button, Input, Form, Cell, Dialog, Toast } from "react-vant";
import axios from "../axios/index";
import { useNavigate } from "react-router-dom";
import Nbbjt from "../components/Nbbjt";

type Props = {};

const Login = (props: Props) => {
  const navigate = useNavigate();
  const [form] = Form.useForm();

  const onFinish = (values: any) => {
    console.log(values);
    axios
      .post("http://localhost:8080/register", {
        username: values.username,
        password: values.password,
      })
      .then((res) => {
        console.log(res.data);
        Toast.success("注册成功");
      });
  };
  // 登录
  const dl = () => {
    navigate("/login2");
  };
  //注销
  const del = () => {
    localStorage.removeItem("token");
    navigate("/home/my");
  };
  return (
    <div className="logins">
      {/* <Nbbjt></Nbbjt> */}
      {/* 注册 */}+
      <div className="aaaa">
        <Form
          form={form}
          onFinish={onFinish}
          footer={
            <div style={{ margin: "16px 16px 0" }}>
              <Button round nativeType="submit" type="primary" block>
                注册
              </Button>
            </div>
          }
        >
          <Form.Item
            tooltip={{
              message:
                "A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.",
            }}
            intro="确保这是唯一的用户名"
            rules={[{ required: true, message: "请填写用户名" }]}
            name="username"
            label="用户名"
          >
            <Input placeholder="请输入用户名" />
          </Form.Item>
          <Form.Item
            rules={[{ required: true, message: "请填写密码" }]}
            name="password"
            label="密码"
          >
            <Input placeholder="请输入密码" />
          </Form.Item>
        </Form>

        <Form
          footer={
            <div style={{ margin: "16px 16px 0" }}>
              <Button
                round
                nativeType="submit"
                type="primary"
                block
                onClick={dl}
              >
                去登陆
              </Button>
            </div>
          }
        ></Form>

        <Form
          footer={
            <div style={{ margin: "16px 16px 0" }}>
              <Button
                round
                nativeType="submit"
                type="primary"
                block
                onClick={del}
              >
                注销
              </Button>
            </div>
          }
        ></Form>
      </div>
      <Nbbjt></Nbbjt>
    </div>
  );
};

export default Login;
